<template>
  <div class="appraisalCompany">
    <van-tabs v-model="active" v-show="!ISshow">
      <van-tab title="建筑企业服务">
        <div class="Authentication">
          <div class="u-search">
            <van-search v-model="values" show-action placeholder="请输入企业名称" @search="onSearch">
              <template #action>
                <div @click="onSearch(values)">搜索</div>
              </template>
            </van-search>
          </div>
          <div class="SQList">
            <ul>
              <div style="clear: both">
                <li v-show="contentData2.length > 0" v-for="(item, index) in contentData2" @click="contentDataClick(item)"
                  :key="index">
                  <p style="font-weight: bold; height: 28px">
                    <span style="float: left;width: 50%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{
                      item.qymc }}</span>
                    <span style="float: right;">{{ item.zzjgdm }}</span>
                  </p>
                  <p style="font-size: 14px; color: #848484; height: 28px">
                    <span style="float: left">入驻区域：{{ item.cityName }}</span>
                    <span style="float: right">企业类型：{{ item.fwlx }}</span>
                  </p>
                  <p style="font-size: 14px; color: #848484; height: 28px">
                    <span style="float: left">资质类别：{{ item.fwlx }}</span>
                  </p>
                  <p style="font-size: 14px; color: #848484; height: 20px">
                    <span
                      style="float: left;width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">单位地址：{{
                        item.dwdz ? item.dwdz : '暂无数据' }}</span>
                  </p>
                </li>
              </div>
              <div style="height: 60vh; text-align: center; padding-top: 20vh" v-show="noData">
                <div style="margin-bottom: 10px">
                  <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
                </div>
                <div>暂无数据</div>
              </div>
            </ul>
          </div>
        </div>
      </van-tab>
      <van-tab title="建筑企业收藏">
        <div class="Authentication">
          <div class="u-search">
            <van-search show-action placeholder="请输入企业名称" @search="onSearch1">
              <template #action>
                <div @click="onSearch1()">搜索</div>
              </template>
            </van-search>
          </div>
          <div class="SQList">
            <ul>
              <div style="clear: both">
                <li v-show="contentData1.length > 0" v-for="(item, index) in contentData1" @click="contentDataClick(item)"
                  :key="index">
                  <p style="font-weight: bold; height: 28px">
                    <span style="float: left">{{ item.qymc }}</span>
                    <span style="float: right">{{ item.TYSHXYDM }}</span>
                  </p>
                  <p style="font-size: 14px; color: #848484; height: 28px">
                    <span style="float: left">入驻区域：{{ item.DWDZ }}</span>
                    <span style="float: right">企业类型：{{ item.ZCZBJ }}</span>
                  </p>
                  <p style="font-size: 14px; color: #848484; height: 28px">
                    <span style="float: left">资质类别：{{ item.FWQY }}</span>
                  </p>
                  <p style="font-size: 14px; color: #848484; height: 20px">
                    <span style="float: left">单位地址：{{ item.dwdz ? item.dwdz : '暂无数据' }}</span>
                  </p>
                </li>
              </div>
              <div style="height: 60vh; text-align: center; padding-top: 20vh" v-show="noData1">
                <div style="margin-bottom: 10px">
                  <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
                </div>
                <div>暂无数据</div>
              </div>
            </ul>
          </div>
        </div>
      </van-tab>
    </van-tabs>
    <div class="Threepage" v-show="ISshow">
      <div class="details" v-for="(item, index) in QY" :key="index">
        <van-cell-group>
          <van-field v-model="row[item.key]" :label="item.lable" />
        </van-cell-group>
      </div>
      <van-tabs type="card">
        <van-tab title="企业资质">
          <div class="card1"></div>
        </van-tab>
        <van-tab title="注册人员"></van-tab>
        <van-tab title="企业介绍">
          <van-field v-model="row.QYJS" rows="2" autosize label="介绍" type="textarea" maxlength="100" placeholder="请输入留言"
            show-word-limit />
        </van-tab>
      </van-tabs>
    </div>
    <div class="footer" v-show="ISshow">
      <van-button @click="handleOk" style="width: 90vw" type="info">确定</van-button>
    </div>
  </div>
</template>


<style lang="scss" scoped>
.appraisalCompany {
  font-size: 14px;
}

::v-deep .van-tabs__nav--card .van-tab {
  color: black;
  border: 1px solid #1989fa;
}

::v-deep .van-tabs__nav--card .van-tab.van-tab--active {
  color: #fff;
  background-color: #1989fa;
}

::v-deep .van-tabs__nav--card {
  border: none;
}

.footer {
  position: fixed;
  bottom: 40px;
  width: 100vw;
  text-align: center;
}

.Authentication {
  width: 100%;
  height: 95vh;
  overflow: auto;
  background: #eee;

  .SQList {
    width: 100vw;
    overflow-x: hidden;
    overflow-y: auto;
    background: #eee;

    li {
      //   padding-top: 4px;
      background-color: white;
      border-radius: 10px;
      padding: 12px;
      width: 96%;
      margin: 0 auto;
      margin-top: 6px;
      color: black;
      box-shadow: 0 0 12px #e3e3e3;
    }
  }

  .u-search {
    padding: 6px 6px 0.05rem 6px;
  }
}
</style>

<style>
.appraisalCompany .van-search {
  padding: 0 !important;
}
</style>


<script>
import { QuerySignCallback, selectTechnicalList } from '../../utils/api'
export default {
  data() {
    return {
      comments: '',
      ISshow: false,
      noData1: false,
      values: '',
      row: {},
      message:
        '惠州政欣工程设计有限公司惠州政欣工程设计有限公司惠州政欣工程设计有限公司惠州政欣工程设计有限公司惠州政欣工程设计有限公司惠州政欣工程设计有限公司惠州政欣工程设计有限公司',
      noData: false,
      active: 0,
      QY: [
        {
          lable: '企业名称',
          key: 'qymc',
          name: '惠州政欣工程设计有限公司',
        },
        {
          lable: '统一信用代码',
          key: 'zzjgdm',
          name: '91330402470891637X',
        },
        {
          lable: '法人代表',
          key: 'lxr',
          name: '***',
        },

        {
          lable: '入驻区域',
          key: 'cityName',
          name: '临安区',
        },
        {
          lable: '企业类型',
          key: 'fwlx',
          name: '临安区',
        },
        {
          lable: '企业成立时间',
          key: 'QYCLSJ',
          name: '1998-02-14',
        },
        {
          lable: '注册资本（万元）',
          key: 'ZCZBJ',
          name: '1998-02-14',
        },
        {
          lable: '通讯地址',
          key: 'dwdz',
          name: '惠州市杭州市临安区',
        },
      ],
      contentData2: [
      ],
      shenkaobeiData: [],
      contentData1: [
        {
          TYSHXYDM: '',
          COMAPNY_NAME: '惠州政欣工程设计有限公司',
          FWQY: '临安区',
          ZCZBJ: '1000万元',
          DWDZ: '惠州市杭州市',
        },
      ],
    }
  },
  methods: {
    onSearch1() { },
    onSearch(val) {
      if (!val) return this.contentData2 = this.shenkaobeiData
      this.contentData2 = this.shenkaobeiData.filter(item => {
        return item.qymc && item.qymc.indexOf(val) > -1
      })
    },
    async getData() {
      let param = {
        appKey: '6738b790-69e8-11ec-a673-6805cab640a0',
        cityCode: window.localStorage.getItem('citycode'),
        belongCountryList: [],
        belongCountyList: [],
        name: '',
        dwlx: '建筑单位',
        pageNo: 1,
        pageSize: 10000,
      }
      const res = await selectTechnicalList(param)
      if (res.data && res.data.data && res.data.data.pageList.length > 0) {
        this.contentData2 = res.data.data.pageList
        this.shenkaobeiData = JSON.parse(JSON.stringify(res.data.data.pageList))
      } else {
        this.noData = true
        this.contentData2 = []
      }
    },
    contentDataClick(data) {
      this.ISshow = true
      this.row = data
    },
    handleOk() {
      if (this.$route.query.id == '施工备案'&&!(JSON.parse(window.sessionStorage.getItem('fileData'))?.S)) {
        this.$router.push({
          path: '/fileData'
        })
        window.sessionStorage.setItem('JZGSData', JSON.stringify(this.row))
      }else if (this.$route.query.id == '施工备案变更'){
        this.$router.push({
          path: '/biangeng'
        })
        window.sessionStorage.setItem('JZGSData', JSON.stringify(this.row))
      } else if(JSON.parse(window.sessionStorage.getItem('fileData'))?.S){
        this.$router.push({
          path: '/fileData',
          query: {
            COMAPNY_NAME: JSON.stringify(this.row),
          },
        })  
      } else if(this.$route.query.id == 'drawingCraftsman'){

      } else if (this.$route.query.id == 'appraisalCompanyNew'){
        //需要更改
        let newObj = JSON.parse(window.sessionStorage.getItem('applyFor'))
        newObj.TYPE = '60'
        newObj.TYPE_DICNAME = '企业'
        newObj.ENTERPRISENAME = this.row.qymc
        newObj.ENTERPRISEDDDRESS = this.row.dwdz
        newObj.LEGALPERSON = this.row.lxr
        newObj.CONTACTNUMBER = this.row.frdh
        newObj.CONSTRUCTIONNUMBER = this.row.aqscxkbh
        newObj.ENTERPRISECODE = this.row.zzjgdm
        window.sessionStorage.setItem('applyFor', JSON.stringify(newObj))
        this.$router.push({
          path: 'selectCompany',
          query: {
            COMAPNY_NAME: JSON.stringify(this.row),
          },
        })
      }
      else {
        this.$router.push({
          path: 'ChooseCraftsman',
          query: {
            COMAPNY_NAME: JSON.stringify(this.row),
          },
        })
      }
    },
  },
  mounted() {
    this.getData()
    ZWJSBridge.setTitle({
      title: '鉴定企业',
    })
  },
}
</script>
